<template>
  <div>
    <div class="header">
      <img class="avaImg" src="../../assets/ava.png" alt="" />
      <span class="header-txt">小老虎</span>
    </div>

    <div class="nav">
      <ul class="navList">
        <li class="navList-item">
          <img class="navList-img" src="../../assets/order.png" alt="">
          <p class="navList-txt">我的订单</p>
        </li>
        <li class="navList-item">
          <img class="navList-img" src="../../assets/coup.png" alt="">
          <p class="navList-txt">优惠券</p>
        </li>
        <li class="navList-item">
          <img class="navList-img" src="../../assets/icon-foot.png" alt="">
          <p class="navList-txt">我的足迹</p>
        </li>
        <li class="navList-item" @click="toCollect">
          <img class="navList-img" src="../../assets/collect.png" alt="">
          <p class="navList-txt">我的收藏</p>
        </li>
        <li class="navList-item" @click="toAddress">
          <img class="navList-img" src="../../assets/addressEdit.png" alt="">
          <p class="navList-txt">我的地址</p>
        </li>
        <li class="navList-item">
          <img class="navList-img" src="../../assets/customer.png" alt="">
          <p class="navList-txt">地址管理</p>
        </li>
        <li class="navList-item">
          <img class="navList-img" src="../../assets/help.png" alt="">
          <p class="navList-txt">帮助中心</p>
        </li>
        <li class="navList-item" @click="toOpinion">
          <img class="navList-img" src="../../assets/opinion.png" alt="">
          <p class="navList-txt">意见反馈</p>
        </li>

      </ul>
    </div>
  </div>
</template>

<script>
import { useRouter } from 'vue-router'
export default {
  name: 'UserApi',
  setup () {
    const router = useRouter()
    const toAddress = () => {
      router.push('/user/address')
    }

    const toCollect = () => {
      router.push('/user/collect')
    }
    const toOpinion = () => {
      router.push('/user/opinion')
    }
    return { toAddress, toCollect, toOpinion }
  }
}
</script>

<style lang="scss" scoped>@import './scss/index.scss'</style>
